<template>
	<view class="details_item bg_color pdd_bottom2">
		<view v-if="!isEnter && !isDelete">
			<view>
				<view class="tit">
					<view class="text">主要信息</view>
				</view>
				<Details :detalisData="detalisData" :detalisList="detalisList"></Details>
				<view class="tit">
					<view class="text">基本信息</view>
				</view>
				<view>
					<Details :detalisData="detalisData" :detalisList="detalisList1">
						<template #data="{ data }">
							<view class="font28" style="color: #222222;" v-if="['keyUnit','firefightingUnits','antiUnit'].includes(data.field)">{{ data.data == 1?'是':'否' }}</view>
							<view class="font28" style="color: #222222;" v-else>
								{{sta[data.field]?.find(ite=>ite.value == data.data).name}}
							</view>
						</template>
					</Details>
				</view>
				<view class="tit">
					<view class="text">负责人/法定代表人</view>
				</view>
				<view :style="{marginBottom:(detalisData.chargePersonName || detalisData.chargePersonPhone||detalisData.chargePersonCard)?'0':'16rpx'}">
					<Details :detalisData="detalisData" :detalisList="detalisList2">
					</Details>
				</view>
				<template v-if="detalisData.chargePersonName || detalisData.chargePersonPhone||detalisData.chargePersonCard">
					<view class="tit">
						<view class="text">保卫负责人信息</view>
					</view>
					<view style="margin-bottom: 16rpx">
						<Details :detalisData="detalisData" :detalisList="detalisList3">
						</Details>
					</view>
				</template>
					<view class="tit" v-if="detalisData.reportStatus == 1 || (store.isFuJing() && !store.isMe(detalisData.userId))">
						<view class="text">核查结果</view>
						<view class="xing" v-if="!detalisData.reportStatus">*</view>
					</view>
					<Form v-if="detalisData.reportStatus == 0 && store.isFuJing() && !store.isMe(detalisData.userId)" ref="formRef" :formList="formList" :formData="detalisData.verifyInfos"></Form>
					<Details
						v-if="detalisData.verifyInfos && detalisData.reportStatus == 1"
						:detalisData="{...detalisData.verifyInfos,reportStatus:detalisData.reportStatus}"
						:detalisList="
							formList.map((item) => {
								return {
									label: item.label,
									field: item.prop,
									slot: item.prop == 'verifierStatus',
								};
							})
						"
					>
						<template #data="{ data }">
							<view :class="{ red: data.data == 1, green: data.data == 2, blue: data.data == 3 }" class="state_view">
								<view class="drop"></view>
								<view class="state font28">{{ formList.find((item) => item.prop == data.field).columns.find((i) => i.value == data.data).name == '上报' ? '已上报' : formList.find((item) => item.prop == data.field).columns.find((i) => i.value == data.data).name }}</view>
							</view>
						</template>
					</Details>
			</view>
			<ButtonFc :detalisData="detalisData" @shangbao="shangbao" @edit="edit" @deleteItem="(deleteShow = true), (deleteId = detalisData.id)"></ButtonFc>
		</view>
		<SubmitState v-if="isEnter" :success="success" @successReturn="fanhui" @failReturn="isEnter = false"></SubmitState>
		<DeleteState v-if="isDelete" :success="success1" @successReturn="fanhui" @failReturn="isDelete = false"></DeleteState>
	</view>
	<DeleteModal :deleteShow="deleteShow" @confirm="confirm" @close="deleteShow = false"></DeleteModal>
</template>
<script>

</script>
<script setup>
import Details from 'com/Details.vue';
import ButtonFc from 'com/ButtonFc.vue';
import DeleteModal from 'com/modal/DeleteModal.vue';
import DeleteState from 'com/modal/DeleteState.vue';
import SubmitState from 'com/modal/SubmitState.vue';
import {detalisList,detalisList1,detalisList2,detalisList3,formList} from './detalisList.js'
import { useDetails } from 'hooks';
import dayjs from 'dayjs'
import Form from 'com/Form.vue';
const formRef = ref(null);
const sta = ref({})
const init = async (currentPage) => {
	const res = await api.queryById('baseUnit',currentPage.options);
	const filter = detalisList1.filter(item=>item.code )
	filter.forEach(async i=>{
		const find = detalisList1.find(item=>item.field ==i.field )
		const res1 = await store1.getDict(find.code)
		sta.value[find.field] = res1
	})
	if (!res.verifyInfos.length && !res.reportStatus) {
		res.verifyInfos = detalisData.value.verifyInfos;
	}
	if (res.verifyInfos.length) {
		res.verifyInfos = res.verifyInfos[0];
	}
	setTittle('核查实有单位', '实有单位详情', res.reportStatus == 0)
	detalisData.value = res;
	}
const { store,api, fanhui, edit, store1,setTittle } = useDetails(init, 'units')
const deleteShow = ref(false);
const deleteId = ref('');
const isEnter = ref(false);
const success = ref('');
const isDelete = ref(false);
const success1 = ref('');

const shangbao = () => {
	formRef.value.submit(async () => {
		const res = await api.report('baseUnit',{ ...detalisData.value.verifyInfos, eventId: detalisData.value.id });
		isEnter.value = true;
		success.value = res;
	});
};
const confirm = async () => {
	deleteShow.value = false;
	const res = await api.deleteData('baseUnit',{ id: deleteId.value });
	isDelete.value = true;
	success1.value = res;
};
const detalisData = ref({
	verifyInfos: {
		verifierName: store.users.username,
		verifierDate: dayjs().format('YYYY-MM-DD HH:mm'),
		verifierUnit: store.users.workAddress,
		verifierPhone: store.users.phone,
		verifierStatus: '',
		situationDescription: ''
	}
});


</script>

<style lang="scss" scoped>
	:deep(.left){
		width: 270rpx !important;
	}
</style>
